/*!
 * Jodit Editor (https://xdsoft.net/jodit/)
 * License https://xdsoft.net/jodit/license.html
 * Copyright 2013-2018 Valeriy Chupurnov https://xdsoft.net
 */
@height-search: 30px;
@width-search: 320px;
@width-search-input-box: 60%;
@width-search-count-box: 15%;
@transform-button-active: 0.95;
@timeout-button-active: .1s;
.jodit_search {
  visibility: hidden;
  &.jodit_search-active {
    visibility: visible;
  }

  position: absolute;
  top: 0;
  right: 0;
  width: 0;
  height: 0;

  .jodit_search_box {
    width: @width-search;
    position: absolute;
    right: 0;
    background-color: @color-toolbar;
    border: 1px solid @color-border;
    border-width: 0 0 1px 1px;
    padding: @padding-default / 2;
    input {
      margin: 0;
      width: 100%;
      height: 100%;
      border: 0;
      background-color: transparent;
      outline: none;
      padding: 0 @padding-default;
      &.jodit_search-replace {
        display: none;
      }
    }
    .jodit_search_buttons,
    .jodit_search_counts,
    .jodit_search_inputs {
      height: @height-search;
      display: inline-block;
      vertical-align: top;
    }
    .jodit_search_inputs {
      width: @width-search-input-box;
      padding-right: @padding-default / 2;
    }
    .jodit_search_counts {
      width: @width-search-count-box;
      line-height: 100%;
      text-align: center;
      color: @color-border;
      border-left: 1px solid @color-border;
      &:before {
        content: '';
        display: inline-block;
        vertical-align: middle;
        height: 100%;
      }
      span {
        display: inline-block;
        vertical-align: middle;
      }
    }
    .jodit_search_buttons {
      padding-left: 0;
      width: 100% - @width-search-input-box - @width-search-count-box;

      button {
        outline: 0;
        width: 32%;
        padding: 1px @padding-default/2;
        margin-right: 1%;
        transition: transform @timeout-button-active linear;
        &.jodit_search_buttons-replace {
          width: 100%;
          border: 1px solid @color-border;
          margin-top: 2px;
          display: none;
        }
        height: 100%;
        border: 1px solid transparent;
        background-color: transparent;
        &:hover {
          background-color: @color-background-button-hover;
        }
        &:focus {
          border: 1px solid fade(@color-background-selection, 50);
        }
        &:active {
          border: 1px solid @color-background-selection;
          transform: scale(@transform-button-active, @transform-button-active);
        }
      }
    }
  }
  &.jodit_search-and-replace {
    .jodit_search_counts,
    .jodit_search_inputs {
      height: @height-search * 2;
      input {
        height: 50%;
        transition: background-color @timeout-button-active linear;
        &:focus {
          //background-color: fade(@color-background-selection, 9);
          box-shadow: inset 0px 0px 3px 0px fade(@color-border, 58);
        }
      }
    }
    .jodit_search_buttons button.jodit_search_buttons-replace,
    .jodit_search_inputs input.jodit_search-replace {
      display: block;
    }
  }
  @media(max-width: @width-search) {
    width: 100%;
    .jodit_search_box {
      width: 100%;
    }
  }
}